<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>来源配置</title>
    <#include "/header.html">

    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">

    <script src="${request.contextPath}/statics/plugins/layui/layui.all.js"></script>

</head>
<body>
<style>
    .bootstrap-select{
        width: 100% !important;
    }
</style>
<div class="layui-container " style="width: 100%;" id="indexModel">

    <div class="layui-row" style="margin-top: 10px;">
        <div class="layui-col-md3 ">
            <input type="text" id="warnName"  required  placeholder="请输入来源" autocomplete="off" class="form-control">
        </div>

        <div class="layui-col-md3 " style="padding-left: 20px;">
            <a class="btn btn-default" id="search">查询</a>
            <a class="btn btn-primary" style="margin-left: 10px;" id="btnadd"><i class="fa fa-plus"></i>&nbsp;新增</a>
        </div>
    </div>

    <div class="layui-row table-striped" style="margin-top: 10px;padding:0 0px;">
        <table id="bootstrap-table" data-mobile-responsive="true"></table>
    </div>

</div>

<div class="layui-container" style="width: 100%;display: none;margin-top: 20px;" id="addModel">
    <form class="layui-form" action="">
        <div class="layui-row" >

            <div class="layui-col-md12" >
                <div class="layui-form-item" style="width: 500px;">
                    <label class="layui-form-label" style="width: 100px;">来源名称</label>
                    <div class="layui-input-block" >
                        <input type="text"  required  id="sourceInfo" placeholder="请输入报警值" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
            <div class="layui-col-md12" >
                <div class="layui-form-item" style="width: 500px;">
                    <label class="layui-form-label" style="width: 100px;">对应字段</label>
                    <div class="layui-input-block" >
                        <input type="text"  required  id="columnKey"  placeholder="请输入报警值" autocomplete="off" class="layui-input">
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-row" >
            <div class="layui-col-md6" style="padding-left: 20px;">
                <div class="layui-btn" id="btnconfirm">确定</div>
                <div class="layui-btn layui-btn-warm" id="btnreturn">返回</div>
            </div>
        </div>
    </form>
</div>

<script>
    var _id = null;
    var _state = null;
    var form = null;
    $(function(){




        $('#btnconfirm').click(function(){
            //确认保存
            if($('#sourceInfo').val()==''){
                layer.msg('来源名称不能为空')
                return;
            }

            if($('#columnKey').val()==''){
                layer.msg('对应字段不能为空')
                return;
            }


            var params = {
                sourceInfo: $('#sourceInfo').val(),
                columnKey:$('#columnKey').val()
            }
            var index = layer.load(2);
            if(_id){
                params.id = _id;
                $.ajax({
                    type: "post",
                    url: baseURL + "registerSource/updateRegisterSource",
                    data:JSON.stringify(params),
                    contentType:"application/json",
                    success: function (data) {
                        layer.close(index);
                        if(data.code==0){
                            layer.msg('修改成功');
                            $('#addModel').hide();
                            $('#indexModel').show();
                            $('#bootstrap-table').bootstrapTable('refresh');
                        }else{
                            layer.msg(data.msg);
                        }
                    }
                })
            }else{
                $.ajax({
                    type: "post",
                    url: baseURL + "registerSource/saveRegisterSource",
                    data:JSON.stringify(params),
                    contentType:"application/json",
                    success: function (data) {
                        layer.close(index);
                        if(data.code==0){
                            layer.msg('添加成功');
                            $('#addModel').hide();
                            $('#indexModel').show();
                            $('#bootstrap-table').bootstrapTable('refresh');
                        }else{
                            layer.msg(data.msg);
                        }
                    }
                })
            }

        })
        $('#btnreturn').click(function(){
            //返回列表
            $('#addModel').hide();
            $('#indexModel').show();
        })


        $('#btnadd').click(function(){
            _id = null;

            showadd()
        })

        $('#search').click(function(){
            $('#bootstrap-table').bootstrapTable('refresh');
        })
        init()
    })
    function edit(e){
        _id = e;
        showadd()
    }

    function remove(e){
        layer.confirm('确定要删除吗？', {icon: 3, title:'提示'}, function(index){
            $.ajax({
                type: "post",
                url: baseURL + "registerSource/delRegisterSource",
                contentType:"application/json",
                data:JSON.stringify({
                    id:e
                }),
                success: function (data) {
                    if(data.code==0){
                        $('#bootstrap-table').bootstrapTable('refresh');
                        layer.msg('删除成功！');
                    }else{
                        layer.msg('数据获取失败');
                    }
                }
            })

            layer.close(index);
        });
    }

    function showadd(){

        $('#sourceInfo').val('');
        $('#columnKey').val('');



        if(_id){
            var index = layer.load(2);

            $.ajax({
                type: "post",
                url: baseURL + "registerSource/getRegisterSourceConfig",
                contentType:"application/json",
                data:JSON.stringify({
                    id:_id
                }),
                success: function (data) {
                    layer.close(index);
                    if(data.code==0){
                        $('#sourceInfo').val(data.result.columnKey);
                        $('#columnKey').val(data.result.sourceInfo);
                    }else{
                        layer.msg('数据获取失败');
                    }
                }
            })
        }





        $('#addModel').show();
        $('#indexModel').hide();


    }
    function init(){
        $('#bootstrap-table')
            .bootstrapTable(
                {
                    method : 'post', // 服务器数据的请求方式 get or post
                    url : baseURL + 'registerSource/findRegisterSourcePage', // 服务器数据的加载地址
                    showRefresh : true,
                    showToggle : true,
                    showColumns : true,
                    showExport :true,
                    sortable: true,
                    sortName:"userId",// 排序列名称
                    sortOrder: "desc",
                    iconSize : 'outline',
                    toolbar : '#exampleToolbar',
                    striped : true, // 设置为true会有隔行变色效果
                    dataType : "json", // 服务器返回的数据类型
                    pagination : true, // 设置为true会在底部显示分页条
                    // queryParamsType : "limit",
                    // //设置为limit则会发送符合RESTFull格式的参数
                    singleSelect : false, // 设置为true将禁止多选
                    // contentType : "application/x-www-form-urlencoded",
                    // //发送到服务器的数据编码类型
                    pageSize : 10, // 如果设置了分页，每页数据条数
                    pageNumber : 1, // 如果设置了分布，首页页码
                    // search : true, // 是否显示搜索框
                    //showColumns : false, // 是否显示内容下拉框（选择显示的列）
                    sidePagination : "server", // 设置在哪里进行分页，可选值为"client" 或者
                    // "server"
                    queryParams : function(params) {

                        return {
                            // 说明：传入后台的参数包括offset开始索引，limit步长，sort排序列，order：desc或者,以及所有列的键值对
                            limit : params.limit+'',
                            page : (params.offset/params.limit)+1+'',
                            sourceInfo:$('#warnName').val()
                        };
                    },
                    // //请求服务器数据时，你可以通过重写参数的方式添加一些额外的参数，例如 toolbar 中的参数 如果
                    // queryParamsType = 'limit' ,返回参数必须包含
                    // limit, offset, search, sort, order 否则, 需要包含:
                    // pageSize, pageNumber, searchText, sortName,
                    // sortOrder.
                    // 返回false将会终止请求
                    columns : [
                        // {
                        //     checkbox : true
                        // },
                        {
                            field : 'sourceInfo',
                            title : '来源名称',
                            align : 'center'

                        },
                        {
                            field : 'columnKey',
                            title : '对应字段',
                            align : 'center'
                        },
                        {
                            field : 'createTime',
                            title : '创建时间',
                            align : 'center'
                        },
                        {
                            title : '操作',
                            field : 'id',
                            align : 'center',
                            formatter : function(value, row,index) {
                                var e = '<div style="margin-right: 10px;" class="btn btn-primary btn-sm " onclick="edit('+row.id+')"><i class="fa fa-edit" style="margin-right:5px;"></i>编辑</div>';
                                var d = '<div class="btn btn-warning btn-sm" onclick="remove('+row.id+')"><i class="fa fa-remove" style="margin-right:5px;"></i>删除</div>';
                                return e + d;

                            }
                        } ]
                });
    }

</script>
</body>
</html>